<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<!-- dean.edwards/2004 -->
<!-- keeping code tidy! -->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
 <title>IE7 {CSS2: auto}</title>

 <!-- compliance patch for microsoft browsers -->
 <!--[if lt IE 7]><script src="../ie7-standard-p.js" type="text/javascript"></script><![endif]-->

 <style type="text/css">

  p.test {
   font: 20px/24px cursive;
   background: #ccc;
   color: red;
   text-align: center;
  }

  p.test::before, p.test::after {
   display: block;
   height: 30px;
   background: yellow none no-repeat top right;
   text-align: left;
  }

  p.test::before {
   content: url(top-left.gif);
   background-image: url(top-right.gif);
  }

  p.test::after {
   content: url(bottom-left.gif);
   background-image: url(bottom-right.gif);
  }

 </style>
</head>
<body>
 <script type="text/javascript" src="ie7-demo.js"></script>
 <h2>content: url(<i>image</i>)</h2>

 <p class="test">Hello World!</p>

 <p>&lt;&nbsp;<a href="javascript:history.back()">back</a></p>
</body>
</html>
